CKEditor 是一款知名的WYSIWYG富文本Web编辑器，WYSIWYG 的全称是what you see is what you get，也就是所见即所得。 富文本是指除了可以在编辑器中输入一般的文本之外， 还可以输入带有样式、格式的文本，以及上传文件以及数学公式等功能。 所见即所得则可以这样理解， 因为要在Web中显示一些样式，势必要用到一些HTML代码标签或者是CSS样式，对于终端的使用者来说，如果不熟悉相关语言的话，编辑代码就很困难了， 所以这类编辑器中输入的内容和最终显示的样式是一样的。目前也有一些比较流行的非所见即所得编辑器， 比如大名鼎鼎的MarkDown, 这些编辑器一般都提供了输入和预览两个部分， 在编辑器中输入带有代码的内容， 在预览窗口查看最终的效果。 CKEditor 历史悠久而且持续在更新和优化，百度也贡献过一个不错的编辑器UEditor，不过自2016年之后就不在更新了。CKEditor 目前的最新版本是CKEditor 5。

考虑不同的使用场景，主要从将工具栏的部分以不同的方式 角度考虑，CKEditor 5提供了以下几种类型的编辑器：

Classic editor 经典编辑器， 工具栏位于输入框的上方。

Inline editor 内联编辑器 ， 默认不显示工具栏， 当输入框获取焦点时，浮动显示工具栏。

Balloon editor 泡泡编辑器 默认不显示工具栏，当选中输入框中的某行时，弹出工具栏

Balloon block editor 泡泡块编辑器 默认不显示工具栏，当选中输入框中的某行时，在左侧有一个小图标块，点击图标时显示编辑器。

Document editor 文档编辑器， 类似Word文档的编辑效果。

相比CKEditor 4版，使用上有一些差别。 CKEditor 5下载的是一个或多个js文件， 官方提供了CKEditor 5的4种下载方式，分别是：

在线构建的地址是： https://ckeditor.com/ckeditor-5/online-builder/ 以经典编辑器为例，勾选需要功能的页面如下：

压缩包下载的地址如下：

https://ckeditor.com/ckeditor-5/download/

该下载页面可以选择不同的编辑器版本，也提供了CDN和npm 的代码块和命令。

此处以CDN引用在线js 的方式演示经典编辑器的使用。示例代码如下：

This is some sample content.

http://jsrun.net/mzaKp/edit